{% extends 'project_python/layout_python.html' %}
{% load static %}

{% block panel_js_files %}
<script src="{% static 'js/sharedkit.js' %}"></script>
{% endblock %}

{% block html_js_code %}
<script>
layui.use(function(){
  var $ = layui.$;
  var layer = layui.layer;
  var util = layui.util;
  var form = layui.form;

  $('#btn_submit').attr('disabled', 'disabled');

    function createProject(){
        $.ajax({
            url: "{% url 'project_python:project_checkpath' %}",
            type: 'post',
            data:{
                'project_dir': $('#id_project_dir').val(),
                'csrfmiddlewaretoken': $('[name="csrfmiddlewaretoken"]').val()
            },
            success: function(response){
                $('#show_error').html(response.message);
                $('#btn_submit').removeAttr('disabled');
            },
            error: function(xhr, status, message) {
                let errorMsg = '';
                if (xhr.responseJSON && xhr.responseJSON.message) {
                    errorMsg += xhr.responseJSON.message;
                } else {
                    errorMsg += message;
                } 
                $('#show_error').html(errorMsg);
            }
        })
    }

    $('#id_project_dir').on('blur', function() {
        createProject();
    })


  util.on('lay-on', {
    'iframe_select_folder': function(){
      layer.open({
        title:"选择文件/文件夹",
        type: 2,
        area: ['800px', '600px'],
        content: '{% url 'sharedkit:picker_file_dir' 'dir' %}?path={{ startpath }}',
        fixed: false, // 不固定
        maxmin: true,
        shade: 0.5,
        shadeClose: false,
        btn: ['选中', '取消'],
        btnAlign: 'c',
        yes: function(index, layero){
          var iframeWin =  window[layero.find('iframe')[0]['name']];
          var elemMark = iframeWin.$('#picker_path'); // 获得 iframe 中某个输入框元素
          var value = elemMark.val();
          if($.trim(value) === '') return elemMark.focus();
          $('#id_project_dir').val(value);
          layer.closeAll();
          createProject();        
        }
      });
    },
  
  })

});
</script>
{% endblock %}
{% block python_content %}
{{ form.errors }}
<div class="card">
<form method="post" class="form-horizontal layui-form">{% csrf_token %}
    <div class="card-body">
        <div class="form-group row mb-0">
            <label class="col-sm-2 col-form-label" for="{{ form.project_dir.id_for_label }}">{{ form.project_dir.label }}</label>
            <div class="col-sm-10">
                <div class="input-group">
                  {{ form.project_dir }}
                  <div class="input-group-append">
                <span class="input-group-text hand-cursor" lay-on="iframe_select_folder"><i class="fas fa-folder-open"></i></span>
                  </div>
                </div>
            <span class="text-info">{{ form.project_dir.help_text }}</span>
            {% if form.project_dir.errors %}{{ form.project_dir.errors }}{% endif %}
            <div id="show_error" class="text-danger text-bold layui-font-16"></div>
            </div>
        </div>
    </div>

    <div class="card-footer">
        <button type="submit" id="btn_submit" class="btn btn-primary" lay-submit lay-on="form_submit">提交创建</button>
    </div>
</form>
</div>
{% endblock %}